<template>
	<div class="mc_view">
		<van-nav-bar :border="false" title="详情" left-arrow @click-left="onClickLeft" />
		
		<div class="mc_solid"></div>
		
		<van-pull-refresh v-model="refreshing" @refresh="onRefresh">
			
			<div v-if="ArticleDdescData == null">
				<img style="width: 1.5rem;height: 1.2rem; display: block;margin: auto;margin-top: 1rem;margin-bottom: 100%;" :src="myApp.srcPath('zanwu.png')" alt="">
			</div>
			
			<div v-if="ArticleDdescData != null" class="mc_conter">
				
				<div v-html="ArticleDdescData.content"></div>
				
			</div>
		
		</van-pull-refresh>
	</div>

</template>

<script>
	import Vue from 'vue';
	import {
		NavBar,
		Toast,
		PullRefresh,
		Icon
	} from 'vant';

	Vue.use(NavBar);
	Vue.use(PullRefresh);
	Vue.use(Icon);

	//请求
	import {
		ArticleDdesc
	} from '../serve/api.js'

	//时间戳转换
	import {dateFormat} from '../utils/dateTime.js'

	export default {
		created() {

			this.ArticleDdesc()

		},
		data() {
			return {
				
				//上拉到底的加载动画  true的时候显示加载完成
				loading: false,
				
				//是否已加载完成
				finished: false,
				
				//下拉刷新动画
				refreshing: false,

				//详情内容
				ArticleDdescData:""
			}
		},

		methods: {
			goUrl(url){
				
				this.$router.push(url)
				
			},
			
			//时间戳转换
			dateFormat(fmt, timestamp){
				
				return dateFormat(fmt, timestamp)
				
			},
			
			onLoad() {
				setTimeout( () => {
					
					//设置刷新动画消失
					this.refreshing = false;
					
				},1000)
				
			},
			onRefresh() {
				
				// console.log("我触发了刷新")
				
				// 清空列表数据
				this.finished = false;

				// 重新加载数据
				// 将 loading 设置为 true，表示处于加载状态
				this.loading = true;
				this.onLoad();
			},
			ArticleDdesc() {

				// console.log(this.$route.query.id)

				let params = {
					
					article_id: this.$route.query.id ? this.$route.query.id : 1
					
				}

				ArticleDdesc(params, (res) => {

					// console.log(res.data.data)

					if(res.data.code == 1){
						
						// Toast("获取成功")
						
						this.ArticleDdescData = res.data.data
						
					}

					

				}, (error) => {

				})

			},
			onClickLeft() {
				// Toast('返回');
				this.$router.go(-1)

			}
		},
	};
</script>

<style scoped="">
	.mc_solid{
		width: 100%;
		height: .17rem;
		background-color: rgb(251,251,251);
	}
	
	.mc_conter img{
		width: 100%;
	}
	
	.mc_conter{
		font-size: .16rem;
		margin-top: .15rem;
		background-color: red;
		background-color: white;
		padding: .3rem;
		box-sizing: border-box;
	}
	
	.mc_view {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: white;
		overflow: auto;
	}
</style>
